<!DOCTYPE html>

<!--<script>-->
<!--    alert("顶部脚本")-->
<!--</script>-->

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #div1{
            height: 400px;
            width: 400px;
            background-color: plum;
        }
    </style>
    <script>
        // alert("头部脚本")
        // var str = "欢迎来到我的世界，我是str变量"
        // document.write(typeof(str))

        // var a, b, c;

    </script>
</head>
<body>
    <div id="div1">

    </div>
</body>

<script>
    // alert("底部脚本")

    var div = document.getElementById("div1")
    // onclick单击事件
    div.onclick = function (){
        div.style.background = 'blue';
    }

</script>

</html>